<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019-07-03
  Time: 16:12
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>发货计划</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <jsp:include page="${pageContext.request.contextPath }/resource_path.jsp" flush="true"/>
    <style type="text/css">
        .layui-table-click{
            background-color:#ddf2e9 !important;
        }
    </style>
</head>
<body>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="">首页</a>
            <a>
              <cite>发货计划</cite>
            </a>
        </span>
    </div>

    <!-- 顶部搜索框 -->
    <div class="x-body">
        <div style="margin-bottom: 18px">
            <div class="layui-inline">
                <table>
                    <tr>
                        <td>
                            <div class="layui-form" style="width: 180px; margin-left: 10px">
                                <input class="layui-input" name="keyword01" id="keyword01" placeholder="请输入生产计划单号" autocomplete="off" style="display: inline; width: 180px; margin-left: 10px">
                            </div>
                        </td>
                        <td>
                            <div class="layui-form" style="width: 180px; margin-left: 10px">
                                <input class="layui-input" name="keyword02" id="keyword02" placeholder="请输入供应商名称" autocomplete="off" style="display: inline; width: 180px; margin-left: 10px">
                            </div>
                        </td>
                        <td>
                            <div class="layui-form" style="width: 180px; margin-left: 10px">
                                <input class="layui-input" name="keyword03" id="keyword03" placeholder="请输入仓库名称" autocomplete="off" style="display: inline; width: 180px; margin-left: 10px">
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
            <button class="layui-btn layui-btn-normal" data-type="reload" style="margin-left: 25px;"><i class="layui-icon layui-icon-search"></i>检索</button>
        </div>
        
        <!-- 发货计划列表 -->
        <table class="layui-hide" id="tableList" lay-filter="tableList"></table>
        <br/><br/>
        <!-- 发货计划详情列表 -->
        <table class="layui-hide" id="tableDetailList" lay-filter="tableDetailList"></table>
        
    </div>

    <script type="text/javascript">
        var table;
        var planId;
        var status;
        layui.use(['table','layer','form','upload'], function() {
            table = layui.table;
            var layer = layui.layer;
            var form = layui.form;
            var upload = layui.upload;
            var $ = layui.jquery, active = {
                reload: function () {
                    var keyword01 = $("#keyword01").val();
                    var keyword02 = $("#keyword02").val();
                    var keyword03 = $("#keyword03").val();
                    table.reload('storageAreaTableId', {
                    	method: 'get'
                        ,where: {"plan_number": keyword01, "supplier_name": keyword02, "warehouse_name": keyword03}
   	                    ,page:{
   							curr:1  //重新从第一页开始
   						}
                    });
                }
            }
            $('.layui-btn').on('click', function () {
                var type = $(this).data('type');
                active[type] ? active[type].call(this) : '';
            });

          	//监听复选框事件，被选中的行高亮显示
    	    table.on('checkbox(tableList)', function(obj){
    	    	if(obj.checked == true && obj.type == 'all'){
    		        //点击全选
    		        $('.layui-table-body table.layui-table tbody tr').addClass('layui-table-click');
    		    }else if(obj.checked == false && obj.type == 'all'){
    		        //点击全不选
    		        $('.layui-table-body table.layui-table tbody tr').removeClass('layui-table-click');
    		    }else if(obj.checked == true && obj.type == 'one'){
    		        //点击单行
    			    if(obj.checked == true){
    			          obj.tr.addClass('layui-table-click');
    			    }else{
    			          obj.tr.removeClass('layui-table-click');
    			    }
    		    }else if(obj.checked == false && obj.type == 'one'){
    		        //点击全选之后点击单行
    		        if(obj.tr.hasClass('layui-table-click')){
    		        	obj.tr.removeClass('layui-table-click');
    		        }
    		    }
    	    });
          
            /* 生产计划列表 */
            table.render({
                elem: '#tableList'
                ,url:'${pageContext.request.contextPath }/DispatchBill/list.do'
                ,title: '发货计划列表'
                ,id :'storageAreaTableId'
                ,limits:[10,20,30]
                ,cols: [[
                    {field:'', title:'序号', type:'numbers', align:'center'},
                    {field:'supplier_name', title:'供应商名称', align:'center'},
                    {field:'warehouse_name', title:'仓库名称', align:'center'},
                    {field:'client_name', title:'主机厂名称', align:'center'},
                    {field:'plan_number', title:'生产计划单号', align:'center'},
                    {field:'user_name', title:'创建人', align:'center'},
                    {field:'create_date', title:'创建日期', align:'center'},
                    {field:'status', title:'计划单状态', align:'center',templet: function(d){
          	    		if (d.status == 0) {
        	    			return '新纪录';
        				}else if(d.status == 1){
        					return '已处理';
        				}
                    }}
                    ,{field:'remark', title:'备注', align:'center', edit: true, event:'remark'}
                    /* ,{fixed:'right',unresize: true, title:'操作', toolbar: '#rowToolbar',width:100, align: 'center'} */
                ]]
                ,page: true
                ,done : function(){
                    $('th').css({
                        'background-color': '#009688', 'color': '#fff','font-weight':'bold',
                    })
                }
            });
            
          	//"补货计划"的行内编辑事件
            table.on('edit(tableList)', function(obj){
                var fieldValue = obj.value, 	//得到修改后的值
                    rowData = obj.data, 		//得到所在行所有键值
                    fieldName = obj.field; 		//得到字段
                	//console.log(rowData.mNum);
                $.ajax({
                    type: "post",
                    url: "${pageContext.request.contextPath }/DispatchBill/update.do",
                    data: { id:rowData.id, remark:fieldValue },
                    success: function(data){
                        if(data > 0){
                        	toastr.success("修改成功！");
                        }else{
                        	toastr.error("修改失败！");
                        }
                    }
                });
            });
            
          	//监听行单击事件(子表：生产计划详情)
	       	table.on('row(tableList)', function(obj){
	       		status = obj.data.status;
	       	  	table.render({
	       		    elem: '#tableDetailList'
	       		    ,url:'${pageContext.request.contextPath }/DispatchBillDetail/list.do'
	       		    ,where:{dispatchId: obj.data.id}
	       		    ,title: '产品的配件详情数据表'
	       		    ,id :'contentDetialTable'
	       		    ,limits:[10,20,30]
	       		    ,cols: [[
	       		    	{field:'left', title:'序号', sort: true, type:'numbers', width: 60},
	       		    	{field:'materiel_name', title:'物料名称', align:'center'},
	       		    	{field:'materiel_num', title:'SAP/QAD', align:'center'},
	                    {field:'planQuantity', title:'生产计划数量', align:'center'},
	                    {field:'storageQuantity', title:'线边库存数量', align:'center'},
	                    {field:'astock', title:'安全库存数量', align:'center'},
	                    {field:'shipmentsQuantity', title:'需发货数量', align:'center'},
	                    {field:'remark', title:'备注', align:'center', edit: true, event:'remark'}
	       		    ]]
	       		    ,page: true
		       		 ,done : function(){
	                    $('th').css({
	                        'background-color': '#009688', 'color': '#fff','font-weight':'bold',
	                    })
	                }
	       		});
	       	});
          	
	      	//"补货计划"的行内编辑事件
            table.on('edit(tableDetailList)', function(obj){
                var fieldValue = obj.value, 	//得到修改后的值
                    rowData = obj.data, 		//得到所在行所有键值
                    fieldName = obj.field; 		//得到字段
                	//console.log(rowData.mNum);
                $.ajax({
                    type: "post",
                    url: "${pageContext.request.contextPath }/DispatchBillDetail/update.do",
                    data: { id:rowData.id, remark:fieldValue },
                    success: function(data){
                        if(data > 0){
                        	toastr.success("修改成功！");
                        }else{
                        	toastr.error("修改失败！");
                        }
                    }
                });
            });
           
        });
        /*提示框样式*/
        toastrStyle()
    </script>
</body>
</html>
